<!DOCTYPE html>
<html>
<head>
	<title>新闻</title>
	<link href="/libs/css/bootstrap.min.css" rel="stylesheet">
	<link href="/libs/css/sweetalert.min.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="/css/public.css">
	<script src="/libs/js/jquery.min.js"></script>
	<script src="/libs/js/bootstrap.min.js"></script>
	<script src="/libs/js/vue.min.js"></script>
	<script src="/libs/js/sweetalert.min.js"></script>
	<style type="text/css">
		[v-cloak] {
		display: none;
		} 
	</style>
</head>
<body>
<div id="app" v-cloak style="padding-bottom: 200px;">

	<nav class="navbar navbar-default" role="navigation">
		<div class="container-fluid">
		<div class="navbar-header">
			<a class="navbar-brand" href="/">新闻网</a>
		</div>
		<div>
			<ul class="nav navbar-nav" style="float:right;">
				<li v-if="userMsg.isLogin == false"><a style="cursor: pointer;" :href="'/register.html?jump='+window.location.pathname+window.location.search">注册</a></li>
				<li v-if="userMsg.isLogin == false"><a style="cursor: pointer;" :href="'/login.html?jump='+window.location.pathname+window.location.search">登录</a></li>
				<li v-if="userMsg.isLogin == true" class="dropdown">
					<a href="#" class="dropdown-toggle" data-toggle="dropdown">
						{{userMsg.name||userMsg.account}}
						<b class="caret"></b>
					</a>
					<ul class="dropdown-menu" style="left:auto;right:0;min-width:100px">
						<li style="height:40px;"><a href="/message.html" style="line-height: 40px">个人信息</a></li>
						<li v-on:click="logout" style="height:40px;"><a href="#" style="line-height: 40px">退出登录</a></li>
					</ul>
				</li>
			</ul>
		</div>
		</div>
	</nav>
	<h1 style="display: block;width: 800px;margin: 0 auto;margin-top:50px;border-bottom: 1px solid #dbdbdb;padding-bottom: 10px;margin-bottom: 20px;">我的信息</h1>
	<div class="message-container">
		<div class="message-item">
			<div class="headimg"><label>我的头像：</label></div>
			<div class="upload">
				<img style="width: 100px;height: 100px;margin-bottom: 20px;" :src="userMsg.headimg||'/assets/head.jpg'">
				<form id="uploadForm">
					<input id="uploader" type="file" name="imgfile">
				</form>
			</div>
		</div>
		<div class="message-item">
			<div class="tips"><label>我的账号：</label></div>
			<div class="message">{{userMsg.account}}</div>
		</div>
		<div class="message-item">
			<div class="tips"><label>设置昵称：</label></div>
			<div class="message">
				<input type="text" class="form-control" v-model="newname" placeholder="请输入昵称" maxlength="8">
			</div>
		</div>
		<div class="message-item">
			<div class="tips"><label>修改密码：</label></div>
			<div class="message">
				<button type="button" class="btn btn-info btn-sm"  v-on:click="$('#passwordModal').modal('show')">修改</button>
			</div>
		</div>
		<div class="message-item">
			<button type="button" v-on:click="save" class="btn btn-success">保存</button>
		</div>
	</div>


	<div class="modal fade" id="passwordModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog" style="width: 350px;margin-top: 150px;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
						&times;
					</button>
					<h4 class="modal-title" id="myModalLabel">
						修改密码
					</h4>
				</div>
				<div class="modal-body">
					<input class="form-control change-password" v-model="oldpassword" type="password" placeholder="输入旧密码" style="margin-bottom: 10px;" maxlength="16">
					<input class="form-control change-password" v-model="newpassword" type="password" placeholder="输入新密码" maxlength="16">
				</div>
				<div class="modal-footer">
					<button v-on:click="changePassword" type="button" class="btn btn-success" style="width: 100px;margin-left: 105px;">保存</button>
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭
					</button>
				</div>
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>


</div>



<script type="text/javascript" src="/js/message.js"></script>
</body>
</html>